<!--
 * @Description: 
 * @Author: 梁晓雨
 * @Date: 2025-01-30 01:48:41
-->
<template>
    <div class="main-content">
        <div class="catalogue">
            <el-avatar :src="datas.data.blogPhotoSrc" class="blog-avatar" />
            <el-text class="catalogueName">{{ datas.data.directoryName }}</el-text>
            <el-text class="blogUpdated">{{ datas.data.blogUpdated }}</el-text>
            <el-text class="fixed-text">最后修改</el-text>
        </div>
        <div class="relay-content">
            <el-text> {{ datas.data.relayContent }} </el-text>
        </div>
        <div class="blog-item-card">
            <div class="blog-item-card-content">
                <div class="blogTitle">
                    <el-text>{{ datas.data.blogTitle }}</el-text>
                </div>
                <div class="blog-item-card-tags">
                    <el-tag round v-for="item in datas.data.tagName" :key="item" type="success">{{ item }}</el-tag>
                </div>
                <div class="blog-item-card-AIsummary">
                    <el-text>{{ datas.data.aiSummary }}</el-text>
                </div>
                <div class="blogText">
                    <div v-html="datas.data.blogText"></div>
                </div>

                <el-button type="primary" link @click="ItemtoBlogMainDetail" class="check-link">查看更多</el-button>
            </div>
        </div>
        <el-divider></el-divider>
    </div>
</template>
<script setup lang="ts">
import router from "@/router";
import store from "@/store";
import { defineProps, ref, Ref } from "vue";
import { defineEmits } from "vue";

interface Tag {
    label: String,
    type: String
}


interface Data {
    blogid: number,
    userid: number,
    blogTitle: string,
    aiSummary: string,
    blogText: string,
    blogPhotoSrc: string,
    directoryId: number,
    directoryName: string,
    directorySrc: string,
    blogUpdated: string,
    tagId: Array<number>,
    tagName: Array<string>,
    relayContent: string,
    originalBlogId: number,
    isDeletedBlog: number,

}

const datas = defineProps<{
    data: Data;
}>();

// 定义emit事件
interface BlogIdInfo {
    userid: number,
    blogid: number
}
const emit = defineEmits<{
    (event: 'goto', value: BlogIdInfo): void;
}>();
const blogIdInfo = ref<BlogIdInfo>({
    userid: 1,
    blogid: 1
})
// 指使父组件跳转到对应的博客详情页
const ItemtoBlogMainDetail = () => {
    blogIdInfo.value.userid = store.getters.getUser.userId;
    blogIdInfo.value.blogid = datas.data.blogid;

    emit('goto', blogIdInfo.value)
}
</script>
<style scoped lang="scss">
@use './BlogItem.scss';
</style>
